<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        #box {
            outline: none;

        }
    </style>
</head>

<body>
    <input type="text" name="" id="box" placeholder="">
    <canvas></canvas>
    <input type="range" name="" id="">
    <input type="color" name="" id="">
</body>
<script>
    //小程序跳转有哪些方式
    //wx.navigateTo 特点保留当前页面，
    //wx.redirectTo 关闭当前页面，跳转页面
    //wx.navigateBack 关闭当前页面，返回上一级页面或多级页面

    //小程序和h5的区别
    /* 
    运行环境，小程序是一种一中应用，运行在微信中；h5是一种技术，运行在浏览器中
    开发成本：
    系统权限：小程序能获取更多的权限，
    运行流畅度：小程序更流畅

    小程序传参
    通过路由跳转传参

    
    SPA(单页面应用)
    整个项目只有一个html文件，优点页面切换快。切点是首屏时间稍慢，seo差
     */
    // console.log(1);
    // setInterval(() => {
    //     console.log(2);
    // }, );

    // new Promise((resolve, reject) => {
    //     setTimeout(() => {

    //     }, timeout);
    // }).then(() => {
    //     console.log(3);
    // }).catch(() => {
    //     console.log(4);
    // })
    // console.log(5);


    console.log('script start');

    setTimeout(function () {
        console.log('setTimeout');
    }, 0);

    new Promise((resolve) => {
        console.log('Promise')
        resolve()
    }).then(function () {
        console.log('promise1');
    }).then(function () {
        console.log('promise2');
    });

    console.log('script end');

</script>

</html>